<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>   
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>  
<%@ taglib uri="http://shiro.apache.org/tags" prefix="shiro" %>       
<c:set var="ctx" value="${pageContext.request.contextPath}"/> 
<%@ taglib prefix="dict" uri="/WEB-INF/tld/dict.tld" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<jsp:include page="../include.jsp"/>

<style type="text/css">
	
</style>
<script type="text/javascript">
	
	var itemsObj;
	$(function() {
		 //初始化数组字典
		itemsObj = <dict:getDictItem dictCode="DICT_SEX"/>;
		initLeftDL();
		initDept();
		parent.$.messager.progress('close');
		var orgId='${orgId}';
		if(orgId){
			$('#dept').combotree('setValue', orgId);
		}
		$('#form').form({
			url : '${ctx}/user/addUser',
			onSubmit : function() {
				validate = $(this).form('validate');
				if(validate){
					var check = checkDataList();
					if(check){
						return true;
					}else{
						return false;
					}
				}else{
					return false;
				}				
			},
			success : function(result) {
				parent.$.messager.progress('close');
				result = $.parseJSON(result);
				if(result.success) {
					parent.$.modalDialog.openner_dataGrid.datagrid('load');
					parent.$.modalDialog.handler.dialog('close');
					parent.$.messager.alert('系统提示', result.msg, 'info');
				} else {
					parent.$.messager.alert('错误', result.msg, 'error');
				}
			}
		});
		
		
		$('#dl1').datalist({
			//url:'${ctx}/user/getCurrentRoles?userId=${userId}',	
			title:"已选操作角色",				
			valueField:'value',	
			textField:'text',	
			lines:false,
			checkbox: true,
			singleSelect:false
		});
		$('#dl2').datalist({
			url:'${ctx}/role/getAllRoles?roleType=${roleType}',	
			title:"全部操作角色",
			valueField:'value',	
			textField:'text',	
			lines:false,
			checkbox: true,
			singleSelect:false
		});
		
		
		
		//移动按钮
		$("#dl_add").click(function () {
			var rows = $("#dl1").datalist("getSelections");			
			//方式2
			$(rows).each(function(i){
				var value = rows[i].value;
				var text = rows[i].text;
				var row = {
					value:value,
					text:text
				};
				//添加
				//$("#dl2").datalist("appendRow",row);
				if(!rightExist(row)){
					$("#dl2").datalist("insertRow",{index:0,row:row});//作为第一条
				}else{
					//删除
					var rowIndex = $("#dl1").datalist("getRowIndex", rows[i]);
					$("#dl1").datalist("deleteRow",rowIndex);
				}
			});
			//移动完后重新加载dl2,否则显示不正常
			$("#dl2").datalist("loadData",$("#dl2").datalist('getRows'));
		});
		//移动按钮
		$("#dl_add_all").click(function () {
			var data = $("#dl1").datalist("getData");
			var rows = data.rows;
			var rowsLength = rows.length;
			var indexArray = new Array();
			for (var i = 0; i < rowsLength; i++){
				var value = rows[i].value;
				var text = rows[i].text;
				var row = {
					value:value,
					text:text
				};
				//添加
				$("#dl2").datalist("appendRow",row);
			}
			//删除
			var rows = $("#dl1").datalist('getRows');
			for(var i=rows.length-1;i>=0;i--){
				$("#dl1").datalist("deleteRow",i);
			}
			//移动完后重新加载dl2,否则显示不正常
			$("#dl2").datalist("reload");
		});
		$("#dl_remove").click(function () {		
			//方式2
			var rows = $("#dl2").datalist("getSelections");
			var rowArray = new Array();
			$(rows).each(function(i){
				var value = rows[i].value;
				var text = rows[i].text;
				var row = {
					value:value,
					text:text
				};
				//添加
				//$("#dl1").datalist("appendRow",row);
				if(!leftExist(row)){
					$("#dl1").datalist("insertRow",{index:0,row:row});//作为第一条					
					//删除
					//var rowIndex = $("#dl2").datalist("getRowIndex", rows[i]);
					//$("#dl2").datalist("deleteRow",rowIndex);
				}				
			});
			//移动完后重新加载dl1,否则显示不正常
			$("#dl1").datalist("loadData",$("#dl1").datalist('getRows'));
			
		});
		$("#dl_remove_all").click(function () {
			var data = $("#dl2").datalist("getData");
			var rows = data.rows;
			var rowsLength = rows.length;
			var indexArray = new Array();
			for (var i = 0; i < rowsLength; i++){
				var value = rows[i].value;
				var text = rows[i].text;
				var row = {
					value:value,
					text:text
				};
				//添加
				if(!leftExist(row)){
					$("#dl1").datalist("appendRow",row);
				}
			}
			//删除
			var rows = $("#dl2").datalist('getRows');
			for(var i=rows.length-1;i>=0;i--){
				//$("#dl2").datalist("deleteRow",i);
			}
			//移动完后重新加载dl1
			$("#dl1").datalist("reload");
		});
		
		loadForm();
	});
	
	function formatterSex(value, row, index){
		var val =  $.getDictItemText(itemsObj,value);
		return val;
	}
	
	function loadForm(){
		var userId = '${userId}';	
		if(userId !=""){
			$('#form').form('load','${ctx}/user/getUserById?userId='+userId);
		}
	}
	
	//dataList 数据校验
	function checkDataList(){			
		var rows = $('#dl1').datagrid('getRows');
		var entities='';
	 	// 循环 datagrid 中现有的数据，并且逐行复制给Entities ，并且转换成json格式
	 	// 在后台反序列话成对象的对象集合。
	    for(var i= 0;i < rows.length;i++)
	    {
	       entities = entities  + JSON.stringify(rows[i]);	       
	    }
	    if(entities==''){
	    	parent.$.messager.alert('错误', '所选操作角色不能为空!', 'error');
	    	return false;
	    }
	    $("#entities").val(entities);
	    return true;
	}
	
	function initLeftDL(){
		if('${userId}'){
			$.ajax({
				type: "POST",
				url: '${ctx}/user/getCurrentRoles?roleType=${roleType}',
				dataType:"json",
				async:true,
				data:{
					userId : '${userId}'
				},
				success: function(data) {	 
					for(var i=0;i<data.length;i++){
						$("#dl1").datalist("insertRow",{index:i,row:data[i]});
					}
				}
			});
		}
	}
	
	//追加的row是否在左边已存在
	function leftExist(row){
		var rows = $('#dl1').datagrid('getRows');
		for(var i= 0;i < rows.length;i++){
			if(row.value == rows[i].value){
				return true;
			}
		}
		return false;
	}
	
	//追加的row是否在左边已存在
	function rightExist(row){
		var rows = $('#dl2').datagrid('getRows');
		for(var i= 0;i < rows.length;i++){
			if(row.value == rows[i].value){
				return true;
			}
		}
		return false;
	}
	
	
	
	function reset(){
		$('#name').val("");
		$('#woNumber').val("");
	}
	
	function doSearch(){
		var _name = $('#name').val();
		var _woNumber = $('#woNumber').val();
		var params = {    
			name: _name,    
			woNumber: _woNumber   
		};
		var url = '${ctx}/emp/listEmps';
		var grid =  $('#cc').combogrid('grid');
		$(grid).datagrid('options').url= url;
		$(grid).datagrid('load',params);
	}
	
	function initDept(){
		$('#dept').combotree({    
			url: '${ctx}/org/getAllOrganization',    
		    required: false,
		    lines:true
		}); 
	}
	
	function formatterOrg(value, row, index){
		if(row.organization){
			return row.organization.deptName;
		}else{
			return value;
		}
	}
</script>
</head>
<body>
	<div class="easyui-layout" data-options="fit:true,border:false">
		<div data-options="region:'center',border:false" title="" style="position:relative;overflow: hidden;">	
			<div class="easyui-layout" data-options="fit:true">
				<div data-options="region:'north',split:false" style="height:100px">
					<form id="form" method="post">
						<input id="entities" name="entities" type="hidden" value="">
						<input name="userId" type="hidden" value="">
						<div style="margin-bottom:5px;padding-top:20px;padding-left:10%">
		                	<input labelAlign="right" class="easyui-textbox" name="userName" value="" style="width:40%" data-options="label:'用户名称:',required:true">
		                	<c:if test="${empty userId}">
		                		<input labelAlign="right" class="easyui-textbox"  type="passWord" name="passWord" value="" style="width:40%" data-options="label:'密码:',required:true">
			            	</c:if>
			            </div>
			            <div style="margin-bottom:5px;padding-left:10%">
			            	 <input labelAlign="right" class="easyui-textbox"  name="realName" value="" style="width:40%" data-options="label:'姓名:'">
			                 <input labelAlign="right" id="dept" name="orgId" class="easyui-textbox" value="" style="width:40%" data-options="label:'所属部门:'">
			            </div> 
			        </form>
				</div>
				<div data-options="region:'center'">
					<div style="margin-bottom:5px;padding-left:8%">
						<table>
							<tr> 
								<td><div id="dl1" style="height:300px;width:300px;"></div></td>
								<td>
									<button id="dl_remove_all" class="easyui-linkbutton" style="width:50px;margin:5px;" data-options="iconCls:'icon-arrow-left'"></button><br />
									<button id="dl_remove" class="easyui-linkbutton" style="width:50px;margin:5px;" data-options="iconCls:'icon-arrow-left2'"></button><br />
									<button id="dl_add" class="easyui-linkbutton" style="width:50px;margin:5px;" data-options="iconCls:'icon-arrow-right2'"></button><br />
									<button id="dl_add_all" class="easyui-linkbutton" style="width:50px;margin:5px;" data-options="iconCls:'icon-arrow-right'"></button><br />
								</td>
								<td><div id="dl2" style="height:300px;width:300px;"></div></td>
							</tr>
						</table>
					</div>          
				</div>
			</div>
		</div>
	</div>
</body>
</html>